<template>
    <div class="refund-list">
        <div class="search-form zw-form-layout">
            <el-form ref="formRef" label-position="right" :model="searchForm" label-width="90px">
                <el-row :gutter="20">
                    <el-col :span="8">
                        <el-form-item label="" label-width="0" prop="keywords">
                            <el-input
                                v-model="searchForm.keywords"
                                class="keywords-content"
                                :placeholder="keyWordTypeList.find(x => x.code === searchForm.seraceType)?.label">
                                <template #prepend>
                                    <el-select
                                        v-model="searchForm.seraceType"
                                        placeholder="Select"
                                        style="width: 180px">
                                        <el-option
                                            v-for="item in keyWordTypeList"
                                            :key="item.code"
                                            :label="item.label"
                                            :value="item.code" />
                                    </el-select>
                                </template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label-width="75px" label="申请时间" prop="createdAt">
                            <div class="picker-container">
                                <el-date-picker
                                    v-model="createdAt"
                                    type="daterange"
                                    range-separator="至"
                                    start-placeholder="开始时间"
                                    end-placeholder="结束时间"
                                    class="place-order-date" />
                            </div>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="售后类型" prop="refundType">
                            <el-select v-model="searchForm.refundType" placeholder="全部">
                                <el-option :value="0" label="全部"></el-option>
                                <el-option
                                    v-for="item in refundTypeOptions"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value" />
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="20"> </el-row>
                <el-row :gutter="20">
                    <el-col :span="8">
                        <el-form-item label-width="75px" label="售后状态" prop="refundStatus">
                            <el-select v-model="searchForm.refundStatus" placeholder="全部状态">
                                <el-option :value="0" label="全部"></el-option>
                                <el-option
                                    v-for="item in refundStatusOptions"
                                    :label="item.label"
                                    :value="item.value"
                                    :key="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="售后子状态" prop="refundSubStatus">
                            <el-select v-model="searchForm.refundSubStatus" placeholder="全部">
                                <el-option :value="0" label="全部"></el-option>
                                <el-option
                                    v-for="item in refundSubStatusOptions"
                                    :label="item.label"
                                    :value="item.value"
                                    :key="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8" class="zw-form-btns">
                        <el-button type="primary" @click="searchHandler">查询</el-button>
                        <el-button plain @click="resetHandler">清空</el-button>
                    </el-col>
                </el-row>
            </el-form>
        </div>
        <div class="container">
            <div class="tabs">
                <el-tabs v-model="searchForm.handleType" @tab-click="tabClick">
                    <el-tab-pane
                        :label="item.label"
                        :name="item.status"
                        v-for="item in refundStatusTypeList"
                        :key="item.status">
                    </el-tab-pane>
                </el-tabs>
                <el-button class="export-btn" @click="orderExport" v-auth="'refund:export'">
                    订单导出&ensp;
                    <!-- <el-icon><Download /></el-icon> -->
                </el-button>
            </div>
            <div class="table-container">
                <div class="table-header">
                    <div class="table-header-con">
                        <div class="table-header-item" v-for="(item, index) in tableHeader" :key="index">
                            {{ item.label }}
                        </div>
                    </div>
                    <div class="order-item-bg"></div>
                </div>
                <div class="table-list" v-if="Data.isRefundList">
                    <div v-for="(item, index) in Data.tableData" :key="index">
                        <div class="table-top">
                            <div class="order-item-title-item">
                                订单号：{{ (item.order || [])[0]?.orderSn }}
                                <div v-if="item.erpOrder == 1" class="sign-erp">ERP</div>
                            </div>
                            <div class="order-item-title-item">
                                买家：{{ (item.user || [])[0]?.nickname }}
                                <span v-if="item.mobile">（{{ item.mobile }}）</span>
                            </div>
                            <div class="order-item-title-item">退单号：{{ item.refundNo }}</div>
                            <div class="order-item-title-item">
                                退款类型：{{ transformStream(item.refundType, 'REFUND_TYPE_OPTIONS') }}
                            </div>

                            <div class="order-item-title-item">
                                售后状态：{{ item.refundStatusInfo?.refundStatusName }}
                            </div>
                            <div>
                                <el-button class="detail-btn" @click="toDetail(item)"> 查看详情 </el-button>
                            </div>
                        </div>
                        <el-table :data="item.refundGoods" :span-method="objectSpanMethod" border :show-header="false">
                            <el-table-column prop="orderId" label="商品信息" width="450">
                                <template #default="scope">
                                    <div class="goods-item" v-if="scope.row.goods">
                                        <img :src="scope.row.goods[0]?.goodsImg" alt="" />
                                        <div class="goods-item-desc">
                                            <div>
                                                <div class="goods-item-name fz13">
                                                    {{ scope.row.goods[0]?.goodsName }}
                                                </div>
                                                <div
                                                    class="goods-item-sku fz13"
                                                    v-for="(el, idx) in scope.row.goods[0]?.skuExtInfo"
                                                    :key="idx">
                                                    {{ el.keyAttributeName }}：{{ el.attributeValue }}
                                                </div>
                                            </div>
                                            <div class="goods-item-price fz13">
                                                <span v-if="item.order[0].orderType === 6">
                                                    <span v-if="scope.row.goods[0].sellPrice > 0"
                                                        >{{ floatDivide(scope.row.goods[0]?.sellPrice, 100) }}元+</span
                                                    >
                                                    <span
                                                        >{{ floatDivide(scope.row.goods[0]?.goodPoints, 100) }}积分
                                                    </span>
                                                </span>
                                                <span v-else>
                                                    <span>
                                                        ￥{{ floatDivide(scope.row.goods[0]?.goodsPrice, 100) }}
                                                    </span>
                                                </span>
                                            </div>
                                            <div class="goods-item-status" v-if="scope.row.afterStatusName">
                                                <div class="status-refund">{{ scope.row.afterStatusName }}</div>
                                            </div>
                                        </div>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column align="center" prop="" width="100px" label="发货状态">
                                <template #default="scope">
                                    <span class="fz13">
                                        {{ scope.row.goods[0]?.goodsStatusName }}
                                    </span>
                                </template>
                            </el-table-column>
                            <el-table-column align="center" prop="refundGoodsCount" width="90" label="退款数量">
                            </el-table-column>
                            <el-table-column prop="" label="退款金额">
                                <template #default>
                                    <div style="font-size: 13px">
                                        <div>
                                            退回现金：<span class="num"
                                                >{{ floatDivide(item.refundPaymentFee, 100) }}
                                            </span>
                                            <span class="cell-sub"
                                                >（含运费：{{ floatDivide(item.refundLogisticsFee, 100) }}）
                                            </span>
                                        </div>
                                        <div>
                                            退回积分：<span class="num"
                                                >{{ floatDivide(item.refundUsePoints, 100) }}
                                            </span>
                                        </div>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column align="center" label="退款原因">
                                <template #default>
                                    <div class="fz13">
                                        {{ item.refundInfo?.reasonName }}
                                    </div>
                                    <div
                                        v-if="
                                            item?.description ||
                                            Object.values(item?.refundInfo?.refundProof || {}).length
                                        "
                                        class="cell-link fz13"
                                        @click="readRefundDetail(item)">
                                        查看退货说明和凭证
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column align="center" label="申请时间">
                                <template #default>
                                    <span class="fz13"> {{ item.createdAt }} </span>
                                </template>
                            </el-table-column>
                            <el-table-column align="center" label="售后子状态">
                                <template #default>
                                    <div class="status">
                                        {{ item.refundStatusInfo?.refundSubStatusName }}
                                        <el-tooltip
                                            effect="dark"
                                            v-if="
                                                item.refundInfo?.refundReason &&
                                                item.refundStatusInfo?.refundSubStatus == 6
                                            "
                                            :content="String(item.refundInfo?.refundReason)"
                                            placement="top-start">
                                            <!-- <span class="question">
                                                <img src="@/assets/imgs/logo/question.png" />
                                            </span> -->
                                            <span class="icon">
                                                <el-icon><WarningFilled /></el-icon>
                                            </span>
                                        </el-tooltip>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column width="130px" align="center" label="操作">
                                <template #default="scope">
                                    <div style="overflow: auto" v-auth="'refund:dispose'">
                                        <div v-if="item.refundStatusInfo?.refundSubStatus == 1">
                                            <el-button
                                                type="primary"
                                                size="small"
                                                @click.stop="refundAuditClick(scope.row, item.refundType)">
                                                {{ item.refundType == 2 ? '同意退货申请' : '同意退款申请' }}
                                            </el-button>
                                        </div>
                                        <div v-if="item.refundStatusInfo?.refundSubStatus == 10">
                                            <el-button type="primary" size="small" @click.stop="reRefund(scope.row)">
                                                同意退款
                                            </el-button>
                                        </div>
                                        <div
                                            style="padding-top: 8px"
                                            v-if="item.refundStatusInfo?.refundSubStatus == 1">
                                            <el-button size="small" @click.stop="clickRefund(scope.row, '1')">
                                                {{ item.refundType == 2 ? '拒绝退货申请' : '拒绝退款申请' }}
                                            </el-button>
                                        </div>
                                        <div class="take-delivery" v-if="item.refundStatusInfo?.refundSubStatus == 8">
                                            <el-button
                                                :disabled="isErpRefund(item.erpOrder)"
                                                type="primary"
                                                size="small"
                                                @click.stop="refundCheck(scope.row)">
                                                确认收货
                                            </el-button>
                                            <el-tooltip
                                                v-if="isErpRefund(item.erpOrder)"
                                                effect="dark"
                                                content="请前往ERP处理售后收货。"
                                                placement="top-start">
                                                <el-icon><QuestionFilled /></el-icon>
                                            </el-tooltip>
                                        </div>
                                        <div
                                            style="padding-top: 8px"
                                            v-if="item.refundStatusInfo?.refundSubStatus == 8">
                                            <el-button size="small" @click.stop="clickRefund(scope.row, '2')">
                                                拒绝收货
                                            </el-button>
                                        </div>
                                        <div v-if="item.refundStatusInfo?.refundSubStatus == 6">
                                            <el-button type="primary" size="small" @click.stop="reRefund(scope.row)">
                                                继续退款
                                            </el-button>
                                        </div>
                                    </div>
                                </template>
                            </el-table-column>
                        </el-table>
                        <div class="order-item-bg"></div>
                    </div>
                </div>
                <div class="no-table-list" v-else>
                    <img src="@/assets/imgs/logo/default.png" alt="" />
                    <div class="no-table-list-text">暂无订单数据</div>
                </div>
            </div>

            <div class="pagination zw-pagination">
                <Pagination
                    :total="Data.totalCount"
                    :page-size="searchForm.perPage"
                    :current-page="searchForm.page"
                    @sizeChange="sizeChange"
                    @pageChange="pageChange" />
            </div>
        </div>

        <el-dialog v-model="dialog.visible" :title="dialog.title">
            <div v-if="dialog.type === 1">
                <div class="dialog-top">
                    <el-icon><WarningFilled /></el-icon>
                    <span>{{ dialog.text }}</span>
                </div>
                <el-form ref="ruleFormRef" :model="dialog" :rules="rules">
                    <el-form-item label="" prop="remark" label-width="0">
                        <el-input
                            type="textarea"
                            :maxlength="100"
                            :rows="6"
                            v-model="dialog.remark"
                            placeholder="请填写拒绝原因（必填，不超过100字）"
                            autocomplete="off" />
                    </el-form-item>
                </el-form>
            </div>
            <div v-else-if="dialog.type === 2">
                <el-form>
                    <el-form-item label="退货说明：" label-width="90">
                        {{ dialog.refundDesc || '-' }}
                    </el-form-item>
                    <el-form-item label="退款凭证：" label-width="90">
                        <div v-if="dialog.imgList?.length">
                            <el-image
                                class="dialog-img"
                                :preview-src-list="dialog.imgList"
                                :initial-index="Data.initialIndex"
                                v-for="(item, idx) in dialog.imgList"
                                @click="refundProofHandler(idx)"
                                :key="item"
                                :src="item">
                            </el-image>
                        </div>
                        <span v-else>-</span>
                    </el-form-item>
                </el-form>
                <div style="text-align: center">
                    <el-button type="primary" @click="dialog.visible = false">关闭</el-button>
                </div>
            </div>
            <template v-if="dialog.type === 1" #footer>
                <span class="dialog-footer">
                    <el-button @click="dialog.visible = false">取消</el-button>
                    <el-button type="primary" @click="clickRefundSubmit">确定</el-button>
                </span>
            </template>
        </el-dialog>

        <el-dialog v-model="dialogForm.visible" title="同意退货，请先完善退货地址">
            <el-form ref="dialogFormRef" :model="dialogForm" label-width="90" :rules="rules">
                <el-form-item label="收货人" prop="receiver">
                    <el-input maxlength="20" v-model.trim="dialogForm.receiver" show-word-limit></el-input>
                </el-form-item>
                <el-form-item label="手机号" prop="mobile">
                    <el-input
                        :maxlength="11"
                        v-model="dialogForm.mobile"
                        placeholder="请输入收货人手机号"
                        autocomplete="off" />
                </el-form-item>
                <el-form-item label="所在地区" prop="area">
                    <el-cascader
                        v-model="dialogForm.area"
                        placeholder="请选择省市区"
                        :options="Data.addressList"
                        :props="defaultProps"
                        @change="handleChange" />
                </el-form-item>
                <el-form-item label="详细地址" prop="street">
                    <el-input
                        v-model="dialogForm.street"
                        placeholder="请填写详细地址"
                        maxlength="100"
                        show-word-limit></el-input>
                </el-form-item>
            </el-form>
            <template #footer>
                <span class="dialog-footer">
                    <el-button @click="dialogForm.visible = false">取消</el-button>
                    <el-button type="primary" @click="saveRefundAddress">保存，并同意退货</el-button>
                </span>
            </template>
        </el-dialog>

        <el-dialog v-model="messagebox.visible" width="400" top="40vh" :title="messagebox.title">
            <div class="messagebox-content">
                <el-icon><WarningFilled /></el-icon>
                <span>{{ messagebox.content }}</span>
            </div>
            <template #footer>
                <span class="dialog-footer">
                    <el-button @click="messagebox.visible = false">{{ messagebox.cancelText }}</el-button>
                    <el-button type="primary" @click="messagebox.confirm()">{{ messagebox.confirmText }}</el-button>
                </span>
            </template>
        </el-dialog>
    </div>
</template>
<script setup name="orderRefundList">
import { ref, reactive, inject, onMounted, onUnmounted, computed } from 'vue';
import { format, floatDivide, packSelectObjUtil, dealObjectEmptyValue, exportExc } from '@/commons/utils.js';
import { useRouter, useRoute } from 'vue-router';
import storage from '@/commons/storage';
import constants from '@/commons/constants';
import request from '@/request';
import { setLayout, resetLayout } from '@/hooks/layout';
import { ZwMessage } from '@/commons';
import Pagination from '@/components/Pagination.vue';
const router = useRouter();
const confirm = inject('confirm');

const refundTypeOptions = reactive(packSelectObjUtil(constants.REFUND_TYPE_OPTIONS));
const refundStatusOptions = reactive(packSelectObjUtil(constants.REFUND_STATUS_OPTIONS));
const refundSubStatusOptions = reactive(packSelectObjUtil(constants.REFUND_SUB_STATUS_OPTIONS));

const route = useRoute();
const currentTabIndex = +route.query.current || 0;
const keyWordTypeList = [
    { label: '订单编号/售后单号', code: 1 },
    { label: '申请人昵称/手机号', code: 2 }
];
const refundStatusTypeList = [
    {
        label: '全部',
        status: 0
    },
    {
        label: '待卖家处理',
        status: 1
    },
    {
        label: '待买家处理',
        status: 2
    }
];
const tableHeader = [
    { label: '商品信息' },
    { label: '发货状态' },
    { label: '退款数量' },
    { label: '退款金额' },
    { label: '退款原因' },
    { label: '申请时间' },
    { label: '售后子状态' },
    { label: '操作' }
];
const searchForm = reactive({
    shopId: null,
    seraceType: 1,
    keywords: '',
    handleType: currentTabIndex,
    refundType: 0,
    refundStatus: 0,
    refundSubStatus: 0,
    createdAtStart: '',
    createdAtEnd: '',
    page: 1,
    perPage: 10
});

const Data = reactive({
    totalCount: 0,
    isRefundList: true,
    tableData: [],
    addressList: [],
    initialIndex: 0
});

const dialog = reactive({
    visible: false,
    //  1 拒绝退款 2 显示退货说明凭证
    type: '',
    text: '',
    title: '',
    refundOrderId: '',
    refundType: '',
    remark: '',
    refundDesc: '',
    imgList: []
});
const rules = {
    remark: [{ required: true, message: '请输入拒绝原因', trigger: 'blur' }],
    receiver: [{ required: true, message: '请填写收货人' }],
    mobile: [
        { required: true, message: '请填写手机号' },
        { pattern: /^1[3-9][0-9]{9}$/, message: '请输入正确手机号' }
    ],
    area: [{ required: true, message: '请填写所在地区', trigger: 'change' }],
    street: [{ required: true, message: '请填写详细地址' }]
};

const dialogForm = reactive({
    visible: false,
    receiver: '', //收货人
    mobile: '', //手机号
    street: '', //详细地址
    provinceId: 1, // '所在地区省份id',
    cityId: '', // '所在地区城市id',
    areaId: 1, // '所在地区县区id',
    area: []
});

const messagebox = reactive({
    visible: false,
    title: '提示',
    content: '',
    cancelText: '取消',
    confirmText: '确定'
});

const defaultProps = {
    emitPath: true,
    label: 'name',
    value: 'id'
};

const createdAt = computed({
    get() {
        return [searchForm.createdAtStart, searchForm.createdAtEnd];
    },
    set(val) {
        if (val) {
            searchForm.createdAtStart = format(val[0], 'YYYY-MM-DD HH:mm:ss');
            searchForm.createdAtEnd = format(val[1], 'YYYY-MM-DD 23:59:59');
        } else {
            searchForm.createdAtStart = '';
            searchForm.createdAtEnd = '';
        }
    }
});

const isErpRefund = val => {
    return val === 1 && openErpRefund.value;
};

const openErpRefund = ref(false);
const getRefundSwitch = async () => {
    const { data } = await request('queryTradeSettingInfoServ');
    // data.receiveConfig：1-商城端 2-ERP端
    openErpRefund.value = data.receiveConfig == 2;
};

const getRefundList = async () => {
    Data.isRefundList = true;
    let params = { ...searchForm };
    let res = await request('getRefundListServ', dealObjectEmptyValue(params));
    Data.tableData = res?.data?.list || [];
    Data.totalCount = res?.data?.totalCount || 0;
    if (!Data.tableData.length) {
        Data.isRefundList = false;
    }
};

const tabClick = ({ paneName }) => {
    searchForm.page = 1;
    setTimeout(() => {
        getRefundList();
    });
};

const toDetail = val => {
    window.open(location.origin + `/order/refund/detail?refundOrderId=${val.id}`);
};

const formRef = ref();
const resetHandler = () => {
    createdAt.value = '';
    formRef.value.resetFields();
};

const pageChange = pageNum => {
    searchForm.page = pageNum;
    getRefundList();
};
const sizeChange = pageSize => {
    searchForm.perPage = pageSize;
    getRefundList();
};
const searchHandler = () => {
    searchForm.page = 1;
    getRefundList();
};

const objectSpanMethod = ({ row, column, rowIndex, columnIndex }) => {
    if ([3, 4, 5, 6, 7].includes(columnIndex)) {
        let row = 0;
        Data.tableData.map(el => {
            if (el.refundGoods.length > row) {
                row = el.refundGoods.length;
            }
        });
        if (rowIndex % row === 0) {
            return {
                rowspan: row,
                colspan: 1
            };
        } else {
            return {
                rowspan: 0,
                colspan: 0
            };
        }
    }
};

// 点击同意按钮
const refundAuditClick = async (val, refundType) => {
    if (refundType == 2) {
        const { data } = await request('refundAddressInfo');
        if (data.receiver && data.mobile && data.street && data.provinceId) {
            checkPassAudit(val.refundOrderId, refundType);
        } else {
            dialogForm.id = data.id;
            dialogForm.receiver = '';
            dialogForm.mobile = '';
            dialogForm.street = '';
            dialogForm.provinceId = 1;
            dialogForm.cityId = '';
            dialogForm.areaId = 1;
            dialogForm.area = [];
            dialogForm.visible = true;
            dialogForm.refundOrderId = val.refundOrderId;
            dialog.refundType = refundType;
        }
    } else {
        checkPassAudit(val.refundOrderId, refundType);
    }
};

const checkPassAudit = (refundOrderId, refundType) => {
    if (refundType == 2) {
        messagebox.content = '确定同意买家退货吗？';
    } else {
        messagebox.content = '确定同意买家退款吗？';
    }
    messagebox.cancelText = '取消';
    messagebox.confirmText = '确定';
    messagebox.refundOrderId = refundOrderId;
    messagebox.confirm = () => refundAuditPass();
    messagebox.visible = true;
};

// 同意退款（退货）申请
const refundAuditPass = async refundOrderId => {
    let params = { refundOrderId: refundOrderId || messagebox.refundOrderId, refundStatus: 3 };
    let res = await request('refundAuditServ', params);
    ZwMessage.success(`允许退款成功`);
    messagebox.visible = false;
    getRefundList();
};

// 点击拒绝申请
const clickRefund = (val, type) => {
    dialog.type = 1;
    dialog.refundOrderId = val.refundOrderId;
    dialog.refundType = type;
    dialog.title = '提示';
    if (dialog.refundType == 1) {
        dialog.text = '确定拒绝买家退款吗?';
    } else {
        dialog.text = '确定拒绝签收买家发的货吗？';
    }
    dialog.remark = '';
    dialog.visible = true;
};

const ruleFormRef = ref();
const clickRefundSubmit = () => {
    ruleFormRef.value.validate(r => {
        if (r) {
            if (dialog.refundType == 2) {
                refundCheckRefuse();
            } else {
                refundAuditConfirm();
            }
        }
    });
};

// 拒绝退款
const refundAuditConfirm = async () => {
    let params = {
        refundRejectReason: dialog.remark,
        refundOrderId: dialog.refundOrderId,
        refundStatus: 2
    };
    let res = await request('refundAuditServ', params);
    if (res.data) {
        ZwMessage.success('拒绝成功');
        dialog.visible = false;
        getRefundList();
    }
};

// 拒绝收货
const refundCheckRefuse = async () => {
    let params = {
        refundOrderId: dialog.refundOrderId,
        refundStatus: 9,
        repositoryRemarks: dialog.remark
    };
    let res = await request('refundCheckServ', params);
    if (res.data) {
        ZwMessage.success(`拒绝成功`);
        dialog.visible = false;
        getRefundList();
    }
};

// 点击确认收货按钮
const refundCheck = val => {
    messagebox.content = '已经收到买家退回的商品吗？';
    messagebox.cancelText = '未收到货';
    messagebox.confirmText = '已收到货';
    messagebox.refundOrderId = val.refundOrderId;
    messagebox.confirm = () => refundCheckConfirm();
    messagebox.visible = true;
};

// 确认收货
const refundCheckConfirm = async () => {
    let params = {
        refundOrderId: messagebox.refundOrderId,
        refundStatus: 10
    };
    let res = await request('refundCheckServ', params);
    if (res.data) {
        ZwMessage.success(`操作成功`);
        messagebox.visible = false;
        getRefundList();
    }
};

// 继续退款
const reRefund = row => {
    request('reRefundServ', { refundOrderId: row.refundOrderId }).then(res => {
        ZwMessage.success(`退款成功`);
        getRefundList();
    });
};

// 查看退货说明和凭证
const readRefundDetail = val => {
    const info = val.refundInfo || {};
    dialog.imgList = Object.values(val.refundProof || {});
    dialog.refundDesc = val.description;
    dialog.title = '退货说明和凭证';
    dialog.type = 2;
    dialog.visible = true;
};

// 订单导出
const orderExport = async () => {
    let param = dealObjectEmptyValue(Object.assign({}, searchForm, { page: '', perPage: '' }));
    request('refundExportServ', param).then(res => {
        exportExc({ data: res }, '售后订单导出');
    });
};

const dialogFormRef = ref();
const saveRefundAddress = async () => {
    dialogFormRef.value.validate(async valid => {
        if (valid) {
            let param = {
                saveType: 'address',
                id: dialogForm.id,
                receiver: dialogForm.receiver, //店铺收货人姓名
                mobile: dialogForm.mobile, //收货人手机号
                street: dialogForm.street, //详细地址
                streetId: 0,
                provinceId: dialogForm.provinceId, // '所在地区省份id',
                cityId: dialogForm.cityId, // '所在地区城市id',
                areaId: dialogForm.areaId
            };
            delete param.area;
            const { code } = await request('refundAddressSave', param);
            ZwMessage.success(`保存成功`);
            dialogForm.visible = false;
            refundAuditPass(dialogForm.refundOrderId);
        }
    });
};

const getAddressList = async () => {
    const { data } = await request('regionServ', { level: 3 });
    if (Array.isArray(data)) {
        data.splice(0, 1);
        Data.addressList = data;
    }
};

const handleChange = val => {
    const [provinceId, cityId, areaId] = val || [];
    dialogForm.provinceId = provinceId;
    dialogForm.cityId = cityId;
    dialogForm.areaId = areaId;
};

const refundProofHandler = index => {
    Data.initialIndex = index;
};

onMounted(() => {
    searchForm.shopId = storage.get('ZW-SHOPID');
    setLayout();
    getRefundList();
    getAddressList();
    getRefundSwitch();
});
onUnmounted(() => {
    resetLayout();
});
</script>
<style lang="scss" src="./style.scss" scoped></style>
